import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';

///监控管理
///文档https://fijkplayer.befovy.com/docs/zh/hello-world.html
class MonitorPage extends StatefulWidget {
  @override
  _MonitorPageState createState() => _MonitorPageState();
}

class _MonitorPageState extends State<MonitorPage> {
  late VideoPlayerController _controller;

  // var _progress = 0.0;
  // var _position = 0;
  // var _duration = 0;
  // final FijkPlayer player = FijkPlayer();
  // bool isPlaying = false;

  // ijkPlayer 初始化不启用缓冲，避免画面卡死不动
  // Future<void> _initPlayer() async {
    // ijkPlayer 初始化不启用缓冲，避免RTSP流卡死
    // await player.setOption(FijkOption.playerCategory, 'packet-buffering', 0);
    // await player.setOption(FijkOption.playerCategory, 'framedrop', 1);
  // }

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.network(
        'https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4')
      ..initialize().then((_) {
        // Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
        setState(() {});
      });

    // player.setDataSource("rtsp://192.168.0.126/ch0",
    //     autoPlay: true, showCover: true);
    // player.setOption(FijkOption.playerCategory, 'packet-buffering', 0);
    // player.setOption(FijkOption.playerCategory, 'framedrop', 1);
    // player.prepareAsync();
    // player.start();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("监控"),
        centerTitle: true,
        backgroundColor: Colors.blue,
      ),
      body: _buildBody(),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            _controller.value.isPlaying
                ? _controller.pause()
                : _controller.play();
          });
        },
        child: Icon(
          _controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
        ),
      ),
    );
  }

  Widget _buildBody() => GridView.builder(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
          mainAxisSpacing: 5,
          crossAxisSpacing: 5,
          mainAxisExtent: 288,
          // childAspectRatio:2.2, //与mainAxisExtent任选其一
        ),
        itemCount: 9,
        itemBuilder: (context, index) => Card(
          elevation: 3,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Container(
                width: 600,
                height: 250,
                // child: FijkView(
                //   fsFit: FijkFit.cover,
                //   fit: FijkFit.cover,
                //   fs: true, //是否全屏
                //   player: player,
                // ),
                child: _controller.value.isInitialized
                    ? AspectRatio(
                        aspectRatio: _controller.value.aspectRatio,
                        child: VideoPlayer(_controller),
                      )
                    : Container(
                        width: 60,
                        height: 60,
                        child: Center(
                          child: CircularProgressIndicator(),
                        ),
                      ),
              ),
            ],
          ),
        ),
      );

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
    // player.stop();
    // player.release();
    // player.dispose();
  }
}
